<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="./template.xhtml">

    <ui:define name="title">
        Dialog - <span class="subitem">Basic</span>
    </ui:define>

    <ui:define name="description">
        Dialog visibility is managed by using show() and hide() methods of the client side api.
    </ui:define>

    <ui:param name="documentationLink" value="/components/dialog" />

    <ui:define name="implementation">
        
        <h:panelGrid columns="1" cellpadding="5">
            <p:commandButton value="Basic" type="button" onclick="PF('dlg1').show();" />
            
            <p:commandButton value="Modal" type="button" onclick="PF('dlg2').show();" />
            
            <p:commandButton value="Effects" type="button" onclick="PF('dlg3').show();" /> 
        </h:panelGrid>
       
        <p:dialog header="Basic Dialog" widgetVar="dlg1" minHeight="40">
            <h:outputText value="Resistance to PrimeFaces is futile!" />
        </p:dialog>
        
        <p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" height="100">
            <h:outputText value="This is a Modal Dialog." />
        </p:dialog>	

        <p:dialog header="Effects" widgetVar="dlg3" showEffect="explode" hideEffect="bounce" height="100">
            <h:outputText value="This dialog has nice effects." />
        </p:dialog>
        
    </ui:define>

</ui:composition>
